<!--
 * @Author: your name
 * @Date: 2021-08-13 14:23:39
 * @LastEditTime: 2021-08-17 13:08:59
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \html&css\项目\2.html&css\guanli.html
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="bootstrap-4.6.0-dist/css/bootstrap.css">
    <script src="bootstrap-4.6.0-dist/js/jquery-3.6.0.min.js"></script>
    <script src="bootstrap-4.6.0-dist/js/bootstrap.js"></script>
    <link rel="stylesheet" href="css/houtaiglxt.css">
    <link rel="stylesheet" href="css/style.css">
    <style>
        .body-left li:nth-child(4) {
            background-color: rgba(0, 0, 0, 0.1);
        }

        .body-left li:nth-child(1) {
            background-color: rgba(247, 247, 247, 1);
        }

        a:hover {
            color: black;
            text-decoration: none;
        }
    </style>
</head>

<body>
    <!-- <button>11111</button> -->
    <div class="head">
        <h1>简书</h1>
        <h3>后台管理系统</h3>
    </div>
    <div class="body clearfix">
        <div class="body-left">
            <ul>
                <li><a href="houtaiglxt.html">管理员管理系统</a></li>
                <li><a href="user.html">用户管理系统</a></li>
                <li><a href="articleglxt.html">文章管理系统</a></li>
                <li><a href="huiyuanxtgl.html">会员管理系统</a></li>
                <li><a href="pinlunglxt.html">评论管理系统</a></li>
                <li><a href="tougaoglxt.html">投稿请求管理系统</a></li>
                <li><a href="guanggao.html">广告管理系统</a></li>
            </ul>
        </div>
        <div class="body-right">
            <div id="seach">
                <nav class="navbar navbar-light bg-light">
                    <a class="navbar-brand">会员管理系统</a>
                    <form class="form-inline">
                        <input class="form-control mr-sm-2" type="search" placeholder="ID" aria-label="Search">
                        <button class="btn btn-outline-success my-2 my-sm-0" type="submit">搜索</button>
                    </form>
                </nav>
            </div>
            <div class="container">
                <div class="row row-cols-4">
                    <div class="col">会员编号</div>
                    <div class="col">姓名</div>
                    <div class="col">会员等级</div>
                    <div class="col">执行操作</div>
                </div>
                <div class="row row-cols-4">
                    <div class="col">L1242</div>
                    <div class="col">张三</div>
                    <div class="col">黑金会员</div>
                    <div class="col"><button type="button" class="btn btn-outline-dark">删除</button><button type="button"
                            class="btn btn-outline-danger">修改</button></div>
                </div>
                <div class="row row-cols-4">
                    <div class="col">S3432</div>
                    <div class="col">李四</div>
                    <div class="col">铂金会员</div>
                    <div class="col"><button type="button" class="btn btn-outline-dark">删除</button><button type="button"
                            class="btn btn-outline-danger">修改</button></div>
                </div>
                <div class="row row-cols-4">
                    <div class="col">S1232</div>
                    <div class="col">王五</div>
                    <div class="col">黄金会员</div>
                    <div class="col"><button type="button" class="btn btn-outline-dark">删除</button><button type="button"
                            class="btn btn-outline-danger">修改</button></div>
                </div>
                <div class="row row-cols-4">
                    <div class="col">H7473</div>
                    <div class="col">赵六</div>
                    <div class="col">白银会员</div>
                    <div class="col"><button type="button" class="btn btn-outline-dark">删除</button><button type="button"
                            class="btn btn-outline-danger">修改</button></div>
                </div>
            </div>
            <div><button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover"
                    data-placement="top" data-content="Top popover">
                    新会员注册
                </button>
            </div>
            <div class="model-1">
                <div class="login-1">
                    <form>
                        <div class="form-group">
                            <label for="exampleInputEmail1">姓名</label>
                            <input type="email" class="form-control" id="exampleInputEmail1"
                                aria-describedby="emailHelp">
                            <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone
                                else.</small>
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">部门</label>
                            <input type="password" class="form-control" id="exampleInputPassword1">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">权限秘钥</label>
                            <input type="password" class="form-control" id="exampleInputPassword1">
                        </div>
                        <div class="form-group form-check">
                            <input type="checkbox" class="form-check-input" id="exampleCheck1" checked>
                            <label class="form-check-label" for="exampleCheck1">自动生成ID</label>
                        </div>
                        <button type="submit" class="btn btn-primary">退出</button>
                        <button type="submit" class="btn btn-primary">确认添加</button>
                    </form>
                </div>
            </div>
            <div class="model-2">
                <div class="login-2">
                    <form>
                        <div class="form-group">
                            <label for="exampleInputEmail1">姓名</label>
                            <input type="email" class="form-control" id="exampleInputEmail1"
                                aria-describedby="emailHelp" placeholder="张三">
                            <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone
                                else.</small>
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">部门</label>
                            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="后勤部">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">部门秘钥</label>
                            <input type="password" class="form-control" id="exampleInputPassword1">
                        </div>
                        <div class="form-group form-check">
                            <input type="checkbox" class="form-check-input" id="exampleCheck1" checked>
                            <label class="form-check-label" for="exampleCheck1">自动生成ID</label>
                        </div>
                        <button type="submit" class="btn btn-primary">退出</button>
                        <button type="submit" class="btn btn-primary">确认添加</button>
                    </form>
                </div>
            </div>
        </div>
        <div class="out">
            <a href="landing.html">
                <button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover"
                    data-placement="top" data-content="Top popover">
                    退出
                </button>
            </a>
        </div>
    </div>
    <script>
        document.getElementsByTagName("button")[9].onclick = function () {
            document.getElementsByClassName("model-1")[0].style.display = "block";
        }
        document.getElementsByTagName("button")[2].onclick = function () {
            document.getElementsByClassName("model-2")[0].style.display = "block";
        }
    </script>
</body>

</html>